<script setup>
const router = useRouter()
const change = (val) => {
  console.log(val)
}
const login = () => {
  router.push('/login')
}
</script>

<template>
  <div class="float-end">
    <t-dropdown :min-column-width="88" trigger="click">
      <t-button theme="default" variant="text">
        求助
      </t-button>
      <template #dropdown>
        <t-dropdown-menu>
          <t-dropdown-item>列表</t-dropdown-item>
          <t-dropdown-item>发布</t-dropdown-item>
        </t-dropdown-menu>
      </template>
    </t-dropdown>
    <t-dropdown :min-column-width="88" trigger="click">
      <t-button theme="default" variant="text">
        督促
      </t-button>
      <template #dropdown>
        <t-dropdown-menu>
          <t-dropdown-item>求督促</t-dropdown-item>
          <t-dropdown-item>督促别人</t-dropdown-item>
          <t-dropdown-item>我的目标</t-dropdown-item>
          <t-dropdown-item>我的目标</t-dropdown-item>
          <t-dropdown-item>我的督促</t-dropdown-item>
          <t-dropdown-item>未交作业</t-dropdown-item>
        </t-dropdown-menu>
      </template>
    </t-dropdown>
    <t-dropdown :min-column-width="88" trigger="click">
      <t-button theme="default" variant="text">
        文章
      </t-button>
      <template #dropdown>
        <t-dropdown-menu>
          <t-dropdown-item>列表</t-dropdown-item>
          <t-dropdown-item>开通</t-dropdown-item>
        </t-dropdown-menu>
      </template>
    </t-dropdown>
    <t-dropdown trigger="click" @click="change" :arrow="false">
      <t-button theme="default" variant="text">
        <!-- <i-material-symbols:supervised-user-circle /> -->
        未登录
      </t-button>
      <template #dropdown>
        <t-dropdown-menu>
          <t-dropdown-item value="login" @click="login"> 登录 </t-dropdown-item>
          <t-dropdown-item value="registry"> 注册 </t-dropdown-item>
        </t-dropdown-menu>
      </template>
    </t-dropdown>
  </div>
</template>